<template>
  <el-dialog
    :append-to-body="true"
    :visible.sync="dialog"
    :title="isAdd ? '新增' : '编辑'"
    width="500px"
  >
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
      <el-form-item label="备件编号" prop="spareno">
        <el-input v-model="form.spareno" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="名称" prop="sparepartname">
        <el-input v-model="form.sparepartname" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="类型" prop="typename">
        <el-input v-model="form.typename" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="品牌">
        <el-select
          allow-create
          filterable
          @keyup.enter.native="onSubmitBrand"
          default-first-option
          v-model="form.sparepartbrand"
          placeholder="请先选择品牌"
          style="width: 370px;"
        >
          <el-option
            v-for="(item, index) in sparepartbrandlist"
            :key="item.label + index"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="型号" >
        <el-select
          allow-create
          filterable
          @keyup.enter.native="onSubmitModelname"
          default-first-option
          v-model="form.spareparttmodel"
          placeholder="请先选择型号"
          style="width: 370px;"
        >
          <el-option
            v-for="(item, index) in sparepartmodellist"
            :key="item.label + index"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="序列号">
        <el-input v-model="form.serialno" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="备件归属">
        <el-input v-model="form.sparebelong" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="存放仓库" prop="warehouse">
        <el-input v-model="form.warehouse" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="供应商">
        <el-input v-model="form.supplier" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="入库人" prop="stock_by">
        <el-input v-model="form.stock_by" style="width: 370px;" />
      </el-form-item>
      <el-form-item label="入库时间" >
        <!-- <el-input v-model="form.stock_time" style="width: 370px;" /> -->
        <el-date-picker
            v-model="form.stock_time"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
        </el-date-picker>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { add, edit } from "@/api/tSparepart";
import { getDictDetails, dictDetailAdd } from "@/api/dictDetail";
import { parseTime } from '@/utils/index'
export default {
  props: {
    isAdd: {
      type: Boolean,
      required: true
    },
    sup_this: {
      type: Object,
      default: null
    },
    eqptId: {
      type: Number
    }
  },
  data() {
    return {
      loading: false,
      dialog: false,
      sparepartbrandlist: [],
      sparepartmodellist: [],
      form: {
        id: "",
        eqpt_id: "",
        spareno: "",
        sparepartname: "",
        typename: "",
        sparepartbrand: "",
        spareparttmodel: "",
        serialno: "",
        sparebelong: "",
        warehouse: "",
        supplier: "",
        stock_by: "",
        stock_time: "",
        stocknum: ""
      },
      rules: {
        spareno: [
          { required: true, message: "请输入备件编号", trigger: "blur" }
        ],
        sparepartname: [
          { required: true, message: "请输入名称", trigger: "blur" }
        ],
        typename: [{ required: true, message: "请输入类型", trigger: "blur" }],
        sparepartbrand: [
          { required: true, message: "请输入品牌", trigger: "blur" }
        ],
        spareparttmodel: [
          { required: true, message: "请输入型号", trigger: "blur" }
        ],
        warehouse: [
          { required: true, message: "请输入存放仓库", trigger: "blur" }
        ],
        stock_by: [
          { required: true, message: "请输入入库人", trigger: "blur" }
        ],
        stock_time: [
          { required: true, message: "请输入入库时间", trigger: "blur" }
        ]
      }
    };
  },
  created() {
    const explorer = navigator.userAgent;
    if (explorer.indexOf("Chrome") >= 0) {
      this.style = "width: 200px";
    } else {
      this.style = "width: 172px";
    }
  },
  methods: {
    onSubmitBrand() {
      var data = {
        id: "",
        label: this.form.sparepartbrand,
        value: this.form.sparepartbrand,
        sort: 999,
        dict: { id: 16 }
      };
      dictDetailAdd(data)
        .then(res => {
          this.$notify({
            title: "添加成功",
            type: "success",
            duration: 2500
          });
        })
        .catch(err => {
          this.loading = false;
          console.log(err.response.data.message);
        });
    },
    onSubmitModelname() {
      var data = {
        id: "",
        label: this.form.spareparttmodel,
        value: this.form.spareparttmodel,
        sort: 999,
        dict: { id: 17 }
      };
      dictDetailAdd(data)
        .then(res => {
          this.$notify({
            title: "添加成功",
            type: "success",
            duration: 2500
          });
        })
        .catch(err => {
          this.loading = false;
          console.log(err.response.data.message);
        });
    },
    cancel() {
      this.resetForm();
    },
    doSubmit() {
      if (this.eqptId > 0) {
        this.form["eqpt_id"] = this.eqptId;
      }
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.isAdd) {
            this.doAdd();
          } else this.doEdit();
        }
      });
    },
    doAdd() {
      add(this.form)
        .then(res => {
          this.resetForm();
          this.$notify({
            title: "添加成功",
            type: "success",
            duration: 2500
          });
          this.loading = false;
          this.$parent.$parent.init();
        })
        .catch(err => {
          this.loading = false;
          console.log(err.response.data.message);
        });
    },
    doEdit() {
      this.form.stock_time = parseTime(this.form.stock_time)

      edit(this.form)
        .then(res => {
          this.resetForm();
          this.$notify({
            title: "修改成功",
            type: "success",
            duration: 2500
          });
          this.loading = false;
          this.sup_this.init();
        })
        .catch(err => {
          this.loading = false;
          console.log(err.response.data.message);
        });
    },
    resetForm() {
      this.dialog = false;
      this.$refs["form"].resetFields();
      this.form = {
        id: "",
        spareno: "",
        sparepartname: "",
        typename: "",
        sparepartbrand: "",
        spareparttmodel: "",
        serialno: "",
        sparebelong: "",
        warehouse: "",
        supplier: "",
        stock_by: "",
        stock_time: "",
        stocknum: ""
      };
    },
    getSparepartBrand() {
      getDictDetails("sparepart_brand").then(res => {
        this.sparepartbrandlist = res.content;
      });
    },
    getSpareparttmodel() {
      getDictDetails("sparepart_modelname").then(res => {
        this.sparepartmodellist = res.content;
      });
    },
  }
};
</script>

<style scoped>
</style>
